<template>
  <view class="me-cell">
    <head-box :isShow="false"></head-box>
    <view class="header">
      <image src="../../static/my-cell/assaas.png" class="header-img"></image>
    </view>
    <tab @click="onTabClick"></tab>
    <tabs-box></tabs-box>
    <div class="ps1 tab-botton">
      <div v-if="actvie === 0">
        <should :src="bannerData.src1" @click="onSrc(0, 'help')"></should>
        <should :src="bannerData.src2" @click="onSrc(1, 'idea')"></should>
        <should :src="bannerData.src3" @click="onSrc(2, 'advisory')"></should>
      </div>
      <div v-if="actvie === 1">
        <question :list="list" @open="onPnes" @opes="opes" ref="list1"></question>
        <u-loadmore :status="status" :icon-type="iconType" @loadmore="loadmore" class="tab-botton" />

      </div>
      <div v-if="actvie === 2">
        <ideas :list="list" @open="onPnes" @opes="opes" ref="list1"></ideas>
        <u-loadmore :status="status" :icon-type="iconType" @loadmore="loadmore" class="tab-botton" />

      </div>
      <div v-if="actvie === 3">
        <regulations @search="onSearch" :list="list" @open="onPnes" @opes="opes" ref="list1"></regulations>
        <u-loadmore :status="status" :icon-type="iconType" @loadmore="loadmore" class="tab-botton" />

      </div>
    </div>
  </view>
</template>

<script>
  import tab from './components/tab'
  import should from './components/should'
  import question from './components/question'
  import ideas from './components/ideas'
  import regulations from './components/regulations'
  import {getContentList,echoVisitPostContent} from '@/api/echo'
  export default {
    components: {
      tab,
      should,
      question,
      ideas,
      regulations,
    },
    data() {
      return {
        iconType: 'flower', //加载图标样式
        status: 'loadmore', //加载的状态
        isLoading: false, //是否要加载数据
        search:'',//搜索内容
        list:[],//数据
        actvie: 0, //tab第几个
        pageNo: 1, //第几页
        pageSize: 20, //每页条数
        //banner数据
        bannerData: {
          src1: '../../static/my-cell/f681dcadad41ede64cc73463c35afc3.png',
          src2: '../../static/my-cell/9d859d3de3281d52b7a05ce98fa1df7.png',
          src3: '../../static/my-cell/d7245e33908adba1da422c7aac67b57.png',
        },
      }
    },
    onLoad(){
      console.log ( this.actvie)
      if(this.actvie===1){
        this.getContentList({
          type:this.actvie
        })
      }

    },
    onShow(){
      // #ifdef H5
      console.log('分享')
      this.$wxSetShare()
      // #endif
    },
    methods: {
      nowsSync(id){

        const strUv = uni.getStorageSync(id)
        if (strUv == null || strUv != id) {
          uni.setStorageSync(id, id)
         this.echoVisitPostContent({flag:0,id})
        } else {
          this.echoVisitPostContent({flag:1,id})
        }
      },
      echoVisitPostContent(data){
        this.$api.showLoading({title:'操作中...'})
        echoVisitPostContent(data).then(res=>{
          this.$api.hideLoading()
        })
      },
      opes(id,index){

        this.nowsSync(id)
        // this.$refs.list1.$refs.uReadMore[index].toggleReadMore()
      },
      //用户访问量-添加
      setStorageNowsSync(id){
      //  this.nowsSync(id)
      },
      //展开操作
      onPnes({id}){
       this.setStorageNowsSync(id)
      },
      //搜索
      onSearch(searchTitle){
        this.onRestFn()
        this.search = searchTitle
        this.getContentList({
          type:this.actvie,
          searchTitle
        })
      },
      //重置
      onRestFn(){
        this.pageNo = 1
        this.status = 'loadmore'
        this.isLoading = false
        this.list = []
      },
      //列表数据
      async getContentList(_params) {
        const params = {
          pageNo: this.pageNo,
          pageSize: this.pageSize,
          ..._params,
        }
        if (this.isLoading) {
          return
        }
        this.isLoading = true
        this.status = 'loading'
        uni.showLoading({
          title: '列表加载中...',
        })
        const {
          code,
          result: { records: list, total },
        } = await getContentList(params)
        if (code === 200) {
          this.isLoading = false
          uni.hideLoading()
          if (!list.length) {
            this.status = 'nomore'
          } else {
            this.status = 'loadmore'
            this.list = [...this.list, ...list]
            if (this.list.length >= total) {
              this.status = 'nomore'
            }
            this.list.map(item=>{
              this.$set(item,'isToggle',false)
            })
          }
        } else {
          this.status = 'nomore'
        }
      },
      loadmore() {
        if(this.actvie>0){
          // 每次出发该方法，都要使页数加一
          this.pageNo++
          this.getContentList({type:this.actvie})
        }

      },
      //tab导航
      onTabClick(type) {
        this.actvie = type
        if(type>0){
          if(type !=3){
            this.search = ''
          }
          this.onRestFn()
          this.getContentList({
            type
          })
        }

      },
      //第index张图片和type类型
      onSrc(i, t) {
        this.$api.handleMenu(`/pages/myHelp/myHelp?type=${t}`)
        // if (index !== 2) {
        //   uni.navigateTo({
        //     url: `/pages/myHelp/myHelp?type=${type}`,
        //   })
        // } else {
        //   uni.navigateTo({
        //     // url: `/pages/myHelp/myHelp?index=${index + 1}`,
        //     url: `/pages/robot/robot?index=${index + 1}&type=${type}`,
        //   })
        // }
      },
    },
    //加载到底部进行请求新的数据
    onReachBottom() {
      if (this.status === 'loadmore') {
        this.loadmore()
      }
    },
  }
</script>

<style lang="scss" scoped>
  .header {
    .header-img {
      width: 100%;
      height: 285rpx;
    }
  }
  .ps1 {
    padding-top: 23rpx;
  }
</style>
